

<!--  逻辑代码 写 函数 定义数据-->
<script setup lang="ts">
import { reactive, ref } from 'vue'

// 定义数据
const getPrice=()=>{
  return food.price++
}
const getFood=()=>{
  return food.food.push('卤蛋')
}
const f={
  food:['鸡腿'],
  price:18
}

const food=reactive(f)
const count=ref(10)
const cats=ref({
  name:"cat",
  age:18
})
const addAge=()=>{
  return cats.value.age++
}
</script>
<!-- 结构 -->
<template>
  <div @click="getPrice">{{ food.price}}</div>
  <div @click="getFood">{{ food.food}}</div>
  <div @click="count++">{{ count}}</div>
  <div @click="addAge">{{ cats}}</div>
</template>
<!-- 样式 -->
<style scoped>
</style>
